<!DOCTYPE html>
<!--
Template Name: Metronic - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.1.1
Version: 2.0.2
Author: KeenThemes
Website: http://www.keenthemes.com/
Contact: support@keenthemes.com
Purchase: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
-->
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<!--<![endif]-->
<!-- BEGIN HEAD -->
<!-- BEGIN BODY -->
<style type="text/css">
select{
height: 23px;

}


#max{
background: none;
}
.row,.wraping{
    background-color: #fff;
}
.row{
    margin:0;
}
.tr-font{
    font-size: 18px;
}
.tr-font select{
    padding: 0;
}
.station-btn-right{
    width: 500px;
    position: absolute;
    top: 64px;
    right: 32px;
    text-align: right;
}
.popup{
    position: absolute;
    width: 820px;
    height: auto;
    left: 50%; top: 40%;
    transform: translate(-50%, -50%);
    z-index: 99999;
    border: 10px solid #fff;
    background-color: #f1f1f1;
    text-align: center;
}
/**/
.flexslider {
    margin: 0px auto;
    position: relative;
    width: 800px;
    height: 600px;
    overflow: hidden;
    zoom: 1;
}
ul li{
     list-style: none;
}
ul.slides{
    padding: 0;
    height: 100%;
}
.flexslider .slides li {
    width: 100%;
    height:100%;
}

.flex-direction-nav a {
    width: 70px;
    height: 70px;
    line-height: 99em;
    overflow: hidden;
    margin: -35px 0 0;
    display: block;
    background: url(assets/images/ad_ctr.png) no-repeat;
    position: absolute;
    top: 50%;
    z-index: 10;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all .3s ease;
    border-radius: 35px;
}

.flex-direction-nav .flex-next {
    background-position: 0 -70px;
    right: 0;
}

.flex-direction-nav .flex-prev {
    left: 0;
}

.flexslider:hover .flex-next {
    opacity: 0.8;
    filter: alpha(opacity=25);
}

.flexslider:hover .flex-prev {
    opacity: 0.8;
    filter: alpha(opacity=25);
}

.flexslider:hover .flex-next:hover,
.flexslider:hover .flex-prev:hover {
    opacity: 1;
    filter: alpha(opacity=50);
}

.flex-control-nav {
    width: 100%;
    position: absolute;
    bottom: 10px;
    text-align: center;
}

.flex-control-nav li {
    margin: 0 2px;
    display: inline-block;
    zoom: 1;
    *display: inline;
}

.flex-control-paging li a.flex-active,
.flex-control-paging li.active a {
    background-position: 0 0;
}

.flexslider .slides a img {
    max-width: 800px;
    max-height: 600px;
    vertical-align: middle;
}
#fancybox_close{
    position: absolute;
    top: -25px;
    right: -25px;
    width: 30px;
    height: 30px;
    background: transparent url(assets/images/fancybox.png) -40px 0px;
    cursor: pointer;
    z-index: 99999;
}
.btn_bg{
    background: url(assets/images/chakan03.png);
    width: 44px;
    height: 20px;
    padding: 0px 8px;
    border-radius: 2px !important;
    display: inline-block;
    margin: 3px 1px;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
}
.li_box{
   display:table;
    text-align:center;
}
.li_box a{
    display:table-cell;
    vertical-align:middle;
    text-align: center;
    width: 100%;
    height: 100%;
}
#shade{
    position:fixed;
    top: 0px;
    opacity: 0.45;
    background-color: #000;
    z-index: 99999;
    left: 0px;
    display: none;
    width: 100%;
    height: 100%;
}
</style>
<body class="page-header-fixed">

<div class="station-btn-right">
        <a class="btn blue" ng-click="exportStation();">
        <i class="fa  fa-arrow-down"></i>
        数据导出
    </a>
    <a class="btn blue" href="javascript:;" ng-click="batchDeleteStation();">
        <i class="fa fa-times"></i>
        批量删除
    </a>
<a class="btn blue" href="javascript:;"  data-target="#modStationModel"
    data-toggle="modal" ng-click="addOnlineStation();">
    <i class="fa fa-plus"></i>
        添加站点
</a>
</div>

<div class="form-group" style="margin: 0px;">

<!-- <div class="row" style="margin-bottom: 10px;">

</div> -->
</div>
<search-data></search-data>
<table class="table table-striped table-bordered table-hover" id="table_1" style="background-color: #fff">
<thead>
<tr class="tr-font">
    <th id="max"><input type="checkbox" class="checkbox_table" /></th>
    <th>站点编号</th>
    <th>名称</th>
    <th>所在地区</th>
<!--     <th>
        <select style="width: 55px;" ng-model="fiterModel.stationType" ng-change="filterStationList();">
            <option value="">全部</option>
            <option value="1">直流</option>
            <option value="2">交流</option>
            <option value="3">混合</option>
        </select>
    </th> -->
    <th>
        <select ng-model="isAllowOpen" ng-change="filterisAllowOpen();" style="width: 87px;">
            <option value="">是否开放</option>
            <option value="1">是</option>
            <option value="0">否</option>
        </select>
    </th>
    <th>
        <select ng-model="currentState" ng-change="filterCurrentState();" style="width: 87px;">
            <option value="">当前状态</option>
            <option value="1">运营中</option>
			<option value="2">安装中</option>
			<option value="3">规划中</option>
        </select>
    </th>
    <th>电桩总数</th>
    <th>操作</th>
</tr>
</thead>
<tbody>
<tr class="odd gradeX" ng-repeat="station in stationList  track by $index" pg-loaded="{{$last}}" target-table="table_1">
    <td>
        <input type="checkbox" class="checkboxes" value="{{station.station_id}}" name="stationRowModel"/>
    </td>
    <td>
        <span ng-bind="station.station_id"></span>
    </td>
    <td>
        <span ng-bind="station.station_name"></span>
    </td>
    <td>
        <span ng-bind="station.district_name"></span>
    </td>
<!--     <td>
        <span ng-bind="station.station_type | getValueInStaticFilter : 'stationTypeArray'"></span>
    </td> -->
    <td>
        <span ng-bind="station.is_allow_open | getValueInStaticFilter : 'whetherArray'"></span>
    </td>
    <td>
        <span ng-bind="station.current_state | getValueInStaticFilter : 'currentStateArray'"></span>
    </td>
    <td>
        <span ng-bind="station.charger_num"></span>
    </td>
    <td>
        <a class="btn" data-target="#" href="index.html#/ownOnlineStationDetail/{{station.station_id}}">
            详情
        </a>
        <a class="btn_bg" data-target="#" ng-click="getStationImages(station.station_id);">
        </a>
    </td>
</tr>
</tbody>
</table>
<tm-pagination conf="paginationConf"></tm-pagination>
<div id="shade"></div>
<div class="popup" ng-if="!!imgesList&&imgesList.length>0">
    <a id="fancybox_close" ng-click="closeImageShow();"></a>
    <div id="banner_tabs" class="flexslider">
    <ul class="slides">
        <li ng-repeat="imge in imgesList" class="li_box">
            <a title=""  href="javascript:;" class="">
                <img src="{{imge}}">
            </a>
        </li>
    </ul>
    <ul class="flex-direction-nav">
        <li><a class="flex-prev"  ng-click="clickImage('prev');">Previous</a></li>
        <li><a class="flex-next"  ng-click="clickImage('next');">Next</a></li>
    </ul>
</div>
</div>

<script type="text/javascript">
$(function(){
    $(document).bind("click",function(e){
        var target  = $(e.target);
        if(target.closest(".popup").length == 0){
            $('#shade').fadeOut(300);
            $(".popup").css('display','none');
        }
    });
})
</script>
<div id="modStationModel" class="modal fade" role="dialog" aria-hidden="true" data-backdrop="false">
    <div class="modal-dialog"  style="width:1000px">
        <div class="modal-content">
            <form class="w5c-form demo-form" role="form" w5c-form-validate="vm.validateOptions" novalidate name="validateForm">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="validateForm.reset()">×</button>
                <h4 class="modal-title">电站信息新增</h4>
            </div>
            <div class="modal-body form">
                <div class="form-group">

                    <div class="row">
                        <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>站点名称</label>
                        <div class="col-sm-4">
                            <div class="input-group">
                                <input type="text" class="form-control" ng-model="addStationInfo.station_name" name="station_name" required="" ng-maxlength="32"
                                ng-pattern='/^[\u4e00-\u9fa5\w]*$/'/>
                            </div>
                        </div>
                        <label class="col-sm-2 control-label text-right"><span class="star-color"></span>站点充电类型</label>
                        <div class="col-sm-4">
                            <div class="input-group">
                                <select ng-model="addStationInfo.station_type" class="form-control" name="station_type">
                                    <option value="">请选择当前状态</option>
                                    <option value="1">直流</option>
                                    <option value="2">交流</option>
                                    <option value="3">混合</option>
                                </select>
                            </div>
                        </div>


                    </div>
                    <div class="row">
                        <label class="col-sm-2 control-label text-right"><span class="star-color"></span>当前状态</label>
                        <div class="col-sm-4">
                            <div class="input-group">
                            <select ng-model="addStationInfo.current_state" class="form-control" name="current_state">
                                <option value="">请选择当前状态</option>
                                <option value="1">运营中</option>
                                <option value="2">安装中</option>
                                <option value="3">规划中</option>
                            </select>
                            </div>
                        </div>
                        <label class="col-sm-2 control-label text-right"><span class="star-color"></span>是否支持开放</label>
                        <div class="col-sm-4">
                            <div class="input-group">
                                <select ng-model="addStationInfo.is_allow_open" class="form-control" name="is_allow_open">
                                    <option value="">请选择是否支持开放</option>
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>充电运营服务商</label>
                        <div class="col-sm-4">
                            <div class="input-group">
                            <select class="form-control"
                                ng-options="operMechant.oper_merchant_id as operMechant.oper_name for operMechant in operMechantList "
                                ng-model="addStationInfo.oper_merchant_id" name="oper_merchant_id" required="">
                                <option value="">请选择服务商</option>
                            </select>
                            </div>
                        </div>
                        <label class="col-sm-2 control-label text-right">合作商</label>
                                          <div class="col-sm-4">
                                            <div class="input-group">
                                              <select class="form-control"
                                              ng-options="merchant.merchant_id as merchant.name for merchant in merchantList "
                                              ng-model="addStationInfo.entity_id" id="selectEntity">
                                              <option value="">请选择商户</option>
                                              </select>
                                            </div>
                                          </div>
                    </div>
                <div class="row">
                        <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>所在城市</label>
                        <div class="col-sm-10" style="padding-left: 15px
                        ">
                            <div class="input-group">
                                <district-select
                                  area-list="areaList"
                                  city-list="cityList"
                                  district-list="districtList"
                                  selected-area="selectedArea"
                                  selected-city="selectedCity"
                                  selected-district="selectedDistrict"
                                  has-init-value="hasInitValue">
                                </district-select>
                            </div>
                        </div>
                </div>
                <div class="row">
                    <label class="col-sm-2 control-label text-right"><span class="star-color"></span>详细地址</label>
                    <div class="col-sm-4">
                        <div class="input-group">
                            <input type="text" class="form-control" ng-model="addStationInfo.address" name="address" ng-maxlength="100"/>
                        </div>
                    </div>
                    <label class="col-sm-2 control-label text-right">所在商圈/楼盘</label>
                    <div class="col-sm-4">
                        <div class="input-group"><input type="text" class="form-control" ng-model="addStationInfo.circle" name="circle" ng-maxlength="128"/></div>
                    </div>
                </div>
                <div class="row">
                    <label class="col-sm-2 control-label text-right">停车处位置</label>
                    <div class="col-sm-4">
                        <div class="input-group">
                            <select ng-model="addStationInfo.parking_type" class="form-control" name="parking_type">
                                <option value="">请选择停车处位置</option>
                                <option value="1">停车楼</option>
                                <option value="2">室外</option>
                                <option value="3">地下室</option>
                            </select>
                        </div>
                    </div>
                    <label class="col-sm-2 control-label text-right"><span class="star-color"></span>所在位置</label>
                    <div class="col-sm-4">
                        <div class="input-group"><input type="text" class="form-control" ng-model="addStationInfo.parking_addr" name="parking_addr" ng-maxlength="100"/></div>
                    </div>
                </div>
                <div class="row">
                        <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>建立时间</label>
                        <div class="col-sm-4">
                            <div class="input-group">
                                <input class="form-control getTime"  type="text" ng-readonly="true"
                                ng-model="addStationInfo.establish_time" name="establish_time" required=""/>
                            </div>
                        </div>
                        <label class="col-sm-2 control-label text-right">站点描述</label>
                        <div class="col-sm-4">
                            <div class="input-group">
                                <textarea class="form-control" rows="3" ng-model="addStationInfo.describes">
                                </textarea>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal" ng-click="validateForm.reset()"><i class="fa fa-times"></i>关闭</button>
                <button type="button" class="btn btn-primary" w5c-form-submit="modifyOwnOnlineStation();"><i class="fa fa-check"></i>保存</button>
            </div>
            </form>
        </div>
    </div>
</div>
</body>
</html>
<script>
$('.getTime').datetimepicker({
language: 'zh-CN',
pickTime: false,
todayBtn: true,
autoclose: true,
minView: '2',
forceParse: false,
format: "yyyy-mm-dd"
});
</script>
